<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>CSS选择器</title>
</head>
<body>
    <!--1.选择 class="intro" 的所有元素-->
    <!-- .intro -->
    <div class="intro"></div>
    <!--2.选择 class 属性中同时有 name1 和 name2 的所有元素-->
    <!-- .name1 .name2 -->
    <div class="name1"></div>
    <div class="name2"></div>
    <!--3.选择 id="firstname" 的元素-->
    <!-- #firstname -->
    <div id="firstname"></div>
    <!--4.选择 class="intro" 的所有 <p> 元素-->
    <!-- p.intro -->
    <p class="intro"></p>
    <!--5.选择父元素是 <div> 的所有 <p> 元素-->
    <!-- div>p -->
    <div>
        <p></p>
    </div>
    <!--6.选择紧跟 <div> 元素的首个 <p> 元素-->
    <!-- div+p -->
    <div></div>
    <p></p>
    <!--7.选择带有 target 属性的所有元素-->
    <!-- [target] -->
    <div target=""></div>
    <!--8.选择带有 target="_blank" 属性的所有元素-->
    <!-- [target=_blank] -->
    <div target="_blank"></div>
    <!--9.	选择其 src 属性值以 "https" 开头的每个 <a> 元素-->
    <!-- a[href^="https"] -->
    <a href="" href^="https"></a>
    <!--10.选择其 src 属性以 ".pdf" 结尾的所有 <a> 元素-->
    <!-- a[href$=".pdf"] -->
    <a href="" href1=".pdf"></a>
    <!--11.选择活动链接-->
    <!-- a:active -->
    <a:active></a:active>
    <!--12.在每个 <p> 的内容之后/前插入内容-->
    <!-- p::after/before -->

    .movie-list>ul>li>(.pic>a[href="https://moive.douban.com/subject/26825482/"]{月球陨落}>img[src="https://img1.doubanio.com/view/photo/s_ratio_poster/public/p2869422067.webp"][data-origin="https://img1.doubanio.com/view/photo/s_ratio_poster/public/p2869422067.webp"][alt="月球陨落"])+(.title>a[href="https://movie.douban.com/subject/26825482/"])+(.rating>span.allstar30+i)+(a[href="https://movie.douban.com/subject/26825482/cinema/"][class="bn-link bn-ticket"]{选座购票})
</body>
</html>